<template>
  <div v-if="bdInfo?.state == '2'">
    <!-- 被保人清单 -->
    <div class="flex items-center justify-between mt-[30px]" style="font-size: 16px">
      <div class="flex items-center">
        <div class="w-[4px] h-[12px] bg-[#EF6800]"></div>
        <div class="ml-[10px] text-[#EF6800]  font-bold">
          保单信息
        </div>
      </div>
    </div>
    <div class="flex mt-[20px]">
      <el-form-item label="保单号" class="flex-1">
        <div class="w-[318px]">{{ bdInfo?.bd_no }}</div>
      </el-form-item>
      <el-form-item label="电子保单" class="flex-1">
        <el-button type="primary" text v-if="bdInfo?.bd_url">
          <a :href="bdInfo?.bd_url" target="_blank">下载电子保单</a>
        </el-button>
        <el-button type="primary" text v-else @click="handleBd">
          获取电子保单
        </el-button>
      </el-form-item>
    </div>
    <!-- <div>
      <div>保单号</div>
      <div>{{ bdInfo?.bd_no }}</div>
    </div>
    <div>
      <div>电子保单</div>
      <div>{{ bdInfo?.bd_no }}</div>
    </div> -->
  </div>
</template>
<script setup lang="ts">
import { defineProps, defineEmits } from "vue";
import { getBd } from "@/utils/api";
const props = defineProps({
  bdInfo: { type: Object },
});
const emit = defineEmits(["getData"]);
const handleBd = async () => {
  const res = await getBd({ id: props.bdInfo?.id });
  if (res.code == 1) {
    emit("getData");
  }
  // console.log(res);
};
</script>
<style scoped lang="scss"></style>
